<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    {include file="/layout/scriptload"}
    <title>模板消息</title>
</head>
<body>
<div id="app">
    <el-container>
        <el-main>
            <div style="margin-bottom: 20px;">
                所属公众号: <span style="margin-right: 20px; color: deepskyblue;">{{gh_name}}</span>
                所属APPID: <span style="color: orange;">{{appid}}</span>
            </div>
            <el-form :label-position="label_position" ref="form_data" :model="form_data">
                <el-form-item label="模板名称" prop="title"
                              :rules="[{required: true, message: '请选择模板', trigger: 'blur'}]">
                    <el-select v-model="form_data.title" placeholder="请选择模板" @change="temp_change">
                        <el-option v-for="item in titles" :key="item.value" :value="item.value" :label="item.label"></el-option>
                    </el-select>
                </el-form-item>
                <!--<el-form-item label="发送时间" v-if="is_send_delay" prop="send_date"-->
                              <!--:rules="[{required: true, message: '请选择发送时间', trigger: 'blur'}]">-->
                    <!--<el-date-picker v-model="form_data.send_date" type="datetime" placeholder="选择时间" align="right"-->
                                    <!--:picker-options="pickerOptions"></el-date-picker>-->
                <!--</el-form-item>-->
                <!--<el-form-item>-->
                    <!--<el-button style="float: right;" type="primary" @click="submit('form_data')">确定</el-button>-->
                <!--</el-form-item>-->
            </el-form>
        </el-main>
    </el-container>
</div>
</body>
<script>
    var vm = new Vue({
        el: '#app',
        data: {
            label_position: 'right',
            gh_name: '',
            appid: '{$appid}',
            titles: [],
            form_data: {
                title: ''
            }
        },
        methods: {
            // 获取该公众号下的所有模板消息
            get_template_list() {
                var that = this;
                $.ajax({
                    type: 'post',
                    cache: false,
                    url: '{:url("template/get_template_list")}',
                    data: {appid: that.appid},
                    success: function (res) {
                        if (res.code == '-1') {
                            that.$message({
                                duration: 5000,
                                type: 'error',
                                message: res.msg,
                            });
                        } else if (res.code == '0') {
                            console.log(res.data);
                            that.gh_name = res.data.gh_name;
                            that.titles = res.data.titles;
                        }
                    },
                    error: function () {
                        that.$message.error("发生系统错误,请与管理员联系！");
                    }
                });
            },
            // 选择模板消息
            temp_change() {},
        }
    });
    vm.get_template_list();
</script>
</html>